<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../css/iconfont.css"  type="text/css">
    <style>
    body,*{
        padding: 0;
        text-align: center;
        margin: 0 auto;
        
    }
    a{
        text-decoration: none;
        color: #999999;
    }

    .top_menu{
        background: #ffe300;
        overflow: hidden;
        height: 56px;
        line-height: 56px;
        margin: 0 auto;
        width: 100%; 
        text-align: center;
    }

    .top_menu ul{
        overflow: hidden;
        padding: 0;
        margin: 0 400px;
        text-align: center;
        float: left;
    }
    .top_menu li{
        padding:30px 20px;
        font-size: 14px;
        color: #282828;
        float: left;
        list-style:none;
    }
    .top_menu a{
        line-height: 0;
    }
    .top_menu a :hover{
        background: #282828;
        color: #ffe300;
    }
        
    
    .banner{
        padding-top: 8px;
        margin: 0px auto;
        overflow: hidden;
        text-align: center;
        vertical-align: middle;
    }
    .banner img{
 
        border-radius: 4px;
        margin: 10px auto;

    }
    .inner img{
        margin-left:240PX;
        vertical-align: middle;
        text-align: center;
        width: 1130px;
        height: 100px;
    }

    /* 设置二级菜单绝对定位，并隐藏 */
    .small > ul > li > ul {
        display: none;
        position: absolute;
    }
  
    /* 鼠标放在一级菜单上，显示二级菜单 */
    .small > ul > li:hover ul {
        display: block;
    }

     /* 设置二级菜单的li的样式 */
     .small > ul > li > ul > li {
        float: left;
        
        display: block;
    }
    
    /* 在一级菜单中，鼠标放上去的样式 */
    .small > ul > li > a:hover {    
        background-color: #ccc;
    }
    /* 在二级菜单中，鼠标放上去的样式 */
    .small > ul > li > ul > li > a:hover {
        background-color: #cdf;
    }
    /* -------------菜单css代码----------end---------- */
    
    .small{
        padding: 0;
        overflow: hidden;
    }
    .small ul{
        margin-top: 30px;
        margin-left: 240px;
        text-align: center;
    }
    .small li{
        font-size: 14px;
        list-style: none;
        padding-right: 40px;
        color: #282828;
        float: left;
    }
    .title{  
        overflow: hidden; 
        clear: both;
        margin: 10px auto;
        padding: 0;
    }
    .title ul{
        margin-left: 630px;
    }
    .title li{
        list-style:none;
        margin:30px;
        padding: 20px 0;
        float: left;
        text-align: center;
    }
	
    
    .main_body{
        overflow: hidden;
        margin-top: -40px;
        padding: 0;
        background-color: rgb(244, 244, 244);

    }
    .row{
        overflow: hidden;
        margin-left: 180px;
        padding: 30px;
    }
    .block .touxiang{
        vertical-align: middle;
        width: 24px;
        height:24px;
        padding: 10px;
        padding-right: 0px;
    }
    
    .block{
        overflow: hidden;
        line-height:20px;
        border-radius:4px;
        border: 0px;
        background-color: white;
        width: 210px;
        margin-right:30px;
        float: left;
    }
    .block p{
        font-size: 14px;
        padding-left: 10px;
    }
    p.context_p{
        padding-top: 4px;
        padding-bottom:10px;
        color: #888888;
        font-size: 12px;
    }
    .icon{
        color:#888888;
        padding: 10px;
        padding-left: 0px;
    }
    .icon span{
        font-size: 10px;
        padding:8px 4px 0px 10px;
        font-weight: normal;
    }
    hr{
        height:1px;
        background-color: rgb(244, 244, 244);
        border:none;
        
    }
    span.user{
        font-size: 12px;
        padding: 4px;
        vertical-align: middle;
    }
    span.time{
        float: right;
        margin-right: 10px;
        font-size: 12px;
        color: #888888;
        padding: 12px;
        vertical-align: middle;
    }
    #page{
        margin-left: 560px;
        text-align: center;
    }
    #page ul{
        
        margin: 0 auto;
        vertical-align: middle;
    }
    #page li{
        border-radius: 4px;
        border: 1px solid #ccc;
        background-color: white;
        padding:10px 14px;
        margin-left: 10px;
        float: left;
        list-style: none;
    }
    .bottom_img{
        margin:80px auto auto auto;
        text-align: center;
        vertical-align: middle;
    }
    .bottom_ad{
        padding-top:10px;
        padding-bottom:40px;
    }
    .bottom_ad .head .left{
        color: #888888;
        float: left;
        font-size: 14px;
        margin-left:15%;
    }
    .bottom_ad .head .right{
        color: #888888;
        float: right;
        font-size: 14px;
        margin-right:15%;
    }
    .bottom_ad .foot{
        overflow: hidden;
        margin-top:30px;
        margin-left: 230px;
    }
    .bottom_block img{
        width: 220px;
        height: 158px;
    }
    .bottom_block{
       overflow: hidden;
        margin-right: 10px;
        float: left;
        border-radius: 4px;
        border: 0px solid #ccc;
        background-color: white;
        text-align: center;
    }
    .bottom_block p{
        font-size: 12px;
        padding:30px auto;
    }
    .footer{
        padding-bottom: 100px;
        background-color: #282828;
    }
    .footer_top{
        padding-top:60px;
        overflow: hidden;
        margin: auto;
        
    }
    .footer_top ul{
        margin-left: 200px;
        float: left;
    }
    .footer_top li{
        float: left;
        list-style:none;
        padding: 10px;
        color: #666666;
        margin:  auto;
    }
    .footer_bottom{
        overflow: hidden;
    }
    ul.t_ul{
        margin-left: 200px;
        float: left;
    }
    ul.t_ul li{
        font-size: 14px;
        float: left;
        list-style:none;
        padding: 10px;
        color: #666666;
        margin:  auto;
    }
    ul.B_ul{
        margin-left: 200px;
        float: left;
    }
    ul.B_ul li{
        font-size: 14px;
        float: left;
        list-style:none;
        padding: 10px;
        color: #666666;
        margin:  auto;
    }
    .inner{
	float:left;
	width:1380px;
    animation-play-state:paused;
}   

    </style>
</head>
<body>
    <div class="head">
        <div class="top_menu">
            <img src="../img/logo.svg"style="padding: 20px;margin: 0 auto;width: 120px;height: 20px;float: left;Padding-right:400px;">
            <ul class="ul_A">
                <a href="#"><li style=" font-weight: bold;">首页</li></a>
                <a href="#"><li>发现</li></a>
                <a href="#"><li>同城</li></a>
                <a href="#"><li>职位</li></a>
                <a href="#"><li>活动</li></a>
                <a href="#"><li>正版素材</li></a>
                <a href="#"><li>课程</li></a>
                <a><li><span class="iconfont" style="font-size: 24px;">&#xe618;</span></li></a>
            </ul>

            <ul style="float: right;margin-right: 140px">
                <a><li><span class="iconfont" style="font-size: 24px;">&#xe605;</span></li></a>
                <a><li><span class="iconfont" style="font-size: 24px;">&#xe661;</span></li></a>
                <a href="#" style="font-size: 14px;color: #282828;font-weight: normal;">登陆</a>
                <a href="#" style="font-size: 14px;color: #282828;font-weight: normal;">丨</a>
                <a href="#" style="font-size: 14px;color: #282828;font-weight: normal;">注册</a>        
            </ul>
           
            
        </div>
        <div class="banner">

                        <div class="inner"><img src="../img/2a5e67c27cbbd7006cb2b5c003b1d053.jpg" alt=""></div>
            </div>
            <br \>
            <hr \>
            <div class="small">
                <ul>
                    <li>全部</li>
                    <li><a href="#">二级test</a>
                        <ul>
                            <li><a href="#">点不到</a></li>
                            <li><a href="#">点不到</a></li>
                            <li><a href="#">点不到</a></li>
                        </ul>
                    </li>
                    <li>UI</li>
                    <li>网页</li>
                    <li>插画</li>
                    <li>动漫</li>
                    <li>摄影</li>
                    <li>空间</li>
                    <li>工业/产品</li>
                    <li>三维</li>
                    <li>影视</li>
                    <li>手工艺</li>
                    <li>纯艺术</li>
                    <li>服装</li>
                    <li>其他</li>
                    <li>自定义  </li>
                </ul>
            </div>
        </div>
        <div class="title">
            <div class="title_a">
                <ul>
                    <a href="index.html" target="_blank"><li >编辑精选</li></a>
                    <a href="find.html" target="_blank"><li style="border-bottom: 1.6px solid #282828;color: #282828">最新发布</li></a>
                    <a href="#"><li>上升最快</li></a>
                </ul>
            </div>
        </div>
    </div>

    <div class="main_body">
        <div class="row">

            <div class="block">
                <img src="../img/block.jpg" alt="">
                <p class="head_p">呆萌的阿猪第二弹</p>
                <p class="context_p">动漫-网络表情</p>
                <div class="icon">
                    <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                </div>
                <hr \>
                <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                <span class="time">12小时以前</span>
            </div>

            <div class="block">
                    <img src="../img/block.jpg" alt="">
                    <p class="head_p">呆萌的阿猪第二弹</p>
                    <p class="context_p">动漫-网络表情</p>
                    <div class="icon">
                        <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                    </div>
                    <hr \>
                    <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                    <span class="time">12小时以前</span>
                </div>

                <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                    </div>

                <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                 </div>

                 <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                    </div>
        </div>

        <div class="row">
            
            <div class="block">
                <img src="../img/block.jpg" alt="">
                <p class="head_p">呆萌的阿猪第二弹</p>
                <p class="context_p">动漫-网络表情</p>
                <div class="icon">
                    <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                </div>
                <hr \>
                <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                <span class="time">12小时以前</span>
            </div>

            <div class="block">
                    <img src="../img/block.jpg" alt="">
                    <p class="head_p">呆萌的阿猪第二弹</p>
                    <p class="context_p">动漫-网络表情</p>
                    <div class="icon">
                        <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                    </div>
                    <hr \>
                    <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                    <span class="time">12小时以前</span>
                </div>

                <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                    </div>

                <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                 </div>

                 <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                    </div>
        </div>

        <div class="row">
            
            <div class="block">
                <img src="../img/block.jpg" alt="">
                <p class="head_p">呆萌的阿猪第二弹</p>
                <p class="context_p">动漫-网络表情</p>
                <div class="icon">
                    <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                </div>
                <hr \>
                <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                <span class="time">12小时以前</span>
            </div>

            <div class="block">
                    <img src="../img/block.jpg" alt="">
                    <p class="head_p">呆萌的阿猪第二弹</p>
                    <p class="context_p">动漫-网络表情</p>
                    <div class="icon">
                        <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                    </div>
                    <hr \>
                    <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                    <span class="time">12小时以前</span>
                </div>

                <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                    </div>

                <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                 </div>

                 <div class="block">
                        <img src="../img/block.jpg" alt="">
                        <p class="head_p">呆萌的阿猪第二弹</p>
                        <p class="context_p">动漫-网络表情</p>
                        <div class="icon">
                            <span class="iconfont icon-eye">&nbsp;233</span><span class="iconfont icon-pinglun">&nbsp;424</span><span class="iconfont icon-dianzan">&nbsp;244</span>
                        </div>
                        <hr \>
                        <img class="touxiang" src="../img/touxiang.jpg"><span class="user">Admin</span>
                        <span class="time">12小时以前</span>
                    </div>
        </div>
        <div id="page">
            <ul>
                <li style="background-color:rgb(255, 227, 0);">1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
                <li>5</li>
                <li>...</li>
                <li>99</li>
                <li>100</li>
                <li>></li>
            </ul>
        </div>
        <div class="bottom_img"><img src="img/ad.jpg" alt="" width="1130px;" height="100px"></div>
       
        <div class="bottom_ad">
            <div class="head">
                <span class="left">猜你喜欢</span>
                <span class="right">换一换</span>
                <br>
            </div>
            <div class="foot">
                <div class="bottom_block">
                    <img src="../img/md.jpg">
                    <p>【脉动】脉动饮料 说一说试用感受...</p>
                </div>
                <div class="bottom_block">
                        <img src="../img/md.jpg">
                        <p>【脉动】脉动饮料 说一说试用感受...</p>
                    </div>
                    <div class="bottom_block">
                            <img src="../img/md.jpg">
                            <p>【脉动】脉动饮料 说一说试用感受...</p>
                        </div>
                        <div class="bottom_block">
                                <img src="../img/md.jpg">
                                <p>【脉动】脉动饮料 说一说试用感受...</p>
                            </div>
                            <div class="bottom_block">
                                    <img src="../img/md.jpg">
                                    <p>【脉动】脉动饮料 说一说试用感受...</p>
                                </div>

            </div>
        </div>
    </div>
    
    <div class="footer">
        <div class="footer_top">
            <ul>
                <li>移动版</li>
                <li>关于我们</li>
                <li>加入站酷</li>
                <li>用户协议</li>
                <li> 隐私政策</li>
                <li> 企业服务</li>
                <li> 帮助中心</li>
                <li> 联系我们</li>
                <li> 中文</li>
                <li> English</li>
            </ul>
            <br \><br \>
            <hr \ style="width: 70%;float: left; margin-left: 200px;margin-top: 10px;height:1px;border:none;background-color: #888888">
            <br \>
        </div>
        <div class="footer_bottom">
            <ul class="t_ul">
                <li>京ICP备737461472号-4 </li>
                <li>丨</li>
                <li>京ICP证130164号</li>
                <li>丨</li>
                <li>京公网安备11010502000501号 </li>
                <li>丨</li>
                <li> 网络文化经营许可证 京网文[2016]6173-844号</li>
                <li>丨</li>
                <li>广播电视节目制作经营许可证（京）字第06990号</li>
            </ul>
            <br \>
            <ul class="B_ul">
                <li>网上有害信息举报专区  </li>
                <li>丨</li>
                <li> 不良信息举报电话：010-56538658</li>
                <li>丨</li>
                <li>举报邮箱 jubao@zcool.com.cn  </li>
                <li>丨</li>
                <li>  联系电话：010-56538600</li>
                <li>丨</li>
                <li>Copyright © 2006-2019 ZCOOL站酷</li>
            </ul>

        </div>
    </div>

    
</body>
</html>